<?php
use yii\helpers\Url;
use yii\bootstrap\ActiveForm;

$this->context->layout = false;

?>
<?php
//使用率
echo $this->render("@app/views/public/useRate.php")
?>
<?php
$form = ActiveForm::begin([
    'id' => 'm-form-pick',
    'options' => [
        'class' => 'form-horizontal'
    ]
]);
?>
<div style="margin:15px;">

    <div class="panel panel-default">
        <div class="panel-heading">条目详情</div>
        <div class="panel-body m-panel-body">
            <div class="m-box">
                <table class="table">
                    <tr id="type">
                        <th width="20%">
                            类型：
                        </th>
                        <td width="30%" id="id_no_one">
                            <input type="text" id="type_one" name="column_id" validationMessage="必须选择此项" required>
                        </td>
                    </tr>
                    <tr id="LEVEL1"></tr>
                    <tr >
                        <th width="20%">
                            详情：
                        </th >
                        <td colspan="3">
                            <textarea type="text" id="content_add" name="content" style="width: 100%;height: 60px" validationMessage="必须填写此项" required></textarea>
                        </td>
                    </tr>

                </table>
            </div>
        </div>
    </div>


    <br>
    <div class="panel panel-default">
        <button type="button" class="k-button k-button-icontext" id="m-submit-pick" href="javascript:;"
           style="margin-top:20px;float:right;"><i class="glyphicon glyphicon-plus"></i>提交</button>
    </div>
    <?php ActiveForm::end(); ?>

    <script>

        $(function () {
            $("#type_one").kendoDropDownList({
                dataTextField: "name",
                dataValueField: "id"
            });
            $.ajax({
                url: "<?=Url::toRoute(['/hr/pick/default/gettype','pid'=>0]); ?>",
                dataType: "json",
                type: "GET",
                success: function (redata) {
                    //单选控件
                    $("#type_one").kendoDropDownList({
                        dataTextField: "name",
                        dataValueField: "id",
                        dataSource: redata,
                        index: -1,
                        change: function (e) {
                            var type_one = $("#type_one");
                            var name = type_one.data("kendoDropDownList").text();
                            if(name == "摘对"){
                                $("#id_no_one").nextAll().remove();
                                $("#LEVEL1").html("");
                            }else{
                                $("#id_no_one").nextAll().remove();
                                setTypeTwoView();
                                var pid = type_one.data("kendoDropDownList").value();
                                getLevelOne(pid);
                            }
                        }
                    })
                }
            });
            $("#m-submit-pick").click(function () {
                var addValidator = $("#m-form-pick").kendoValidator().data("kendoValidator");
                if(!addValidator.validate()){
                    return;
                }
                var _this = $(this);
                _this.prop("disabled",true);
                _this.parents("#m-form-pick").ajaxSubmit({
                    url: "<?=Url::to(['insert']); ?>",
                    dataType: "json",
                    success: function (redata) {
                        if (redata.status == 1) {
                            layer.msg(redata.info, {icon: 6});
                            var _addWindow = addWindow.data('kendoWindow');
                            _addWindow.refresh();
                            _grid.data("kendoGrid").dataSource.read();
                            _grid.data("kendoGrid").refresh();
                            _addWindow.close();
                        } else {
                            _this.prop("disabled",false);
                            layer.msg(redata.info, {icon: 5});
                        }
                    }
                })
            })
        });
        function getLevelOne(pid) {
            $.ajax({
                url: "<?=Url::toRoute(['/hr/pick/default/gettype','pid'=>'']); ?>"+pid,
                dataType: "json",
                type: "GET",
                success: function (redata) {
                    var level_one = $("#level_one");
                    level_one.kendoDropDownList({
                        dataTextField: "name",
                        dataValueField: "id",
                        dataSource: redata,
                        index: -1,
                        change: function (e) {
                            InitializeLevel_two();
                            pid = level_one.data("kendoDropDownList").value();
                            getLevelTwo(pid);
                        }
                    })
                }
            });
        }
        function getLevelTwo(pid) {
            $.ajax({
                url: "<?=Url::toRoute(['/hr/pick/default/gettype','pid'=>'']); ?>"+pid,
                dataType: "json",
                type: "GET",
                success: function (redata) {
                    //单选控件
                    var dropDownList= $("#level_two").data("kendoDropDownList");
                    dropDownList.setDataSource(redata);
                    dropDownList.select(-1);
                }
            });
        }

        function setTypeTwoView(){
            $("#type").append("<th></th><td></td>");
            $("#LEVEL1").html("<th width='20%'>错误一级类别：</th><td width='30%'><input style='width:100%' type='text' id='level_one' name='level_one' validationMessage='必须选择此项'required></td><th width='20%'>错误二级类别：</th><td width='30%'><input style='width:100%' type='text' id='level_two' name='level_two' validationMessage='必须选择此项'required></td>");
            InitializeLevel_one();
            InitializeLevel_two();
        }
        function InitializeLevel_one(){
            $("#level_one").kendoDropDownList({
                dataTextField: "name",
                dataValueField: "id",

            });
        }
        function InitializeLevel_two() {
            $("#level_two").kendoDropDownList({
                dataTextField: "name",
                dataValueField: "id"
            });
        }

    </script>